<template>
    <div class="person-center-content">
        <div class="person-center-item person-account">
            <div class="person-center-hd">
                <span class="person-center-title">账户管理</span>
            </div>
            <div class="person-center-bd">
                <div class="person-account-num clear">
                    <div class="account-item">
                        <div class="account-hd">账户余额</div>
                        <div class="account-bd">¥1000.00</div>
                    </div>
                    <div class="account-item">
                        <div class="account-hd">C资产</div>
                        <div class="account-bd">0.0000</div>
                    </div>
                    <div class="account-item" style="border-right:0;">
                        <div class="account-hd">
                            <span class="init-code a2">普惠积分</span>
                        </div>
                        <div class="account-bd">
                            <p class="tac">
                                <span>10000.0000</span>
                            </p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    
        <div class="person-center-item person-account">
            <div class="person-account-ft clear">
                <a href="我要充值.html" class="input-btn account-btn">我要充值</a>
                <a href="我要提现.html" class="input-btn account-btn2">我要提现</a>
                <a href="提现账户.html" class="input-btn account-btn2">提现账户</a>
                <a href="javascript:;" class="orange-a set-auto" style="line-height: 43px;">提现设置</a>
            </div>
        </div>
    
        <div class="person-center-item">
            <div class="tab">
                <el-tabs v-model="activeName" @tab-click="handleClick">
                    <el-tab-pane label="账户余额明细" name="first">
                        <div class="table">
                            <el-table :data="tableData" border style="width: 100%" :default-sort="{prop: 'date', order: 'descending'}">
                                <el-table-column prop="id" label="兑换编号" width="200px">
                                </el-table-column>
                                <el-table-column prop="money" label="支付现金">
                                </el-table-column>
                                <el-table-column prop="version" label="积分类型">
                                </el-table-column>
                                <el-table-column prop="num" label="积分数量">
                                </el-table-column>
                                <el-table-column prop="code" label="普惠积分">
                                </el-table-column>
                                <el-table-column prop="date" label="兑换时间" width="220px">
                                </el-table-column>
                            </el-table>
                        </div>
                        <div class="page-main clear">
                            <el-pagination layout="prev, pager, next, jumper">
                            </el-pagination>
                        </div>
                    </el-tab-pane>
                    <el-tab-pane label="提现记录明细" name="second">
    
                    </el-tab-pane>
                </el-tabs>
            </div>
        </div>
    </div>
</template>
<script>
export default {
    data() {
        return {
            tableData: [{
                id: '2017071515512758',
                money: '1000.00',
                version: '云汇通/全球通',
                num: '200',
                code: '1000.0000',
                date: '2017-06-26 18:00:00'
            }, {
                id: '2017071515512756',
                money: '1050.00',
                version: '云汇通/全球通',
                num: '200',
                code: '1000.0000',
                date: '2017-06-27 18:00:00'
            }, {
                id: '2017071515512757',
                money: '1050.00',
                version: '云汇通/全球通',
                num: '200',
                code: '1000.0000',
                date: '2017-06-25 18:00:00'
            }],
            activeName: 'first'
        }
    },

    components: {

    },
    methods: {
        formatter(row, column) {
            return row.address;
        },

        // tab点击触发
        handleClick(tab, event) {
            console.log(tab, event);
        }
    }
}
</script>
